import {
  wxcdTjByParams,
} from '../../../../api/statistics'
import * as echarts from '../../../../components/ec-canvas/echarts';
let chart = null;
var option = {
  tooltip: {
    trigger: 'item'
  },
  // legend: {
  //   orient:'vertical',
  //   top: 'center',
  //   right: 0,
  // },
  series: [{
    type: 'pie',
    itemStyle: {
      borderRadius: 5,
      borderColor: '#F6F6F6',
      borderWidth: 2
    },
    radius: ['20%', '50%'],
    data: [],
    label: {
      normal: {
        formatter: '{b}:{c}',
        show: true,
        // position: 'inside'
      }
    },
    labelLine: {
      length: 10,
      length2: 10,
    }
  }]
};

function initChart(canvas, width, height, dpr) {
  chart = echarts.init(canvas, null, {
    width: width,
    height: height,
    devicePixelRatio: dpr // new
  });
  canvas.setChart(chart);
  return chart;
}
Component({

  /**
   * 页面的初始数据
   */
  data: {
    loading: false,
    startDate: '',
    endDate: '',
    ec: {
      onInit: initChart
    },
    form: {
      hy: '',
      zwbj: '',
      qh: '',
      startDate: '',
      endDate: ''
    }
  },
  methods: {
    // 时间选择器返回数据
    dateChange(e) {
      this.setData({
        'form.startDate': e.detail.startDate,
        'form.endDate': e.detail.endDate
      })
    },
    // 区选择器返回数据

    quChange(event) {
      this.setData({
        'form.qh': event.detail.bm,
      })
    },
    // 主委办局返回数据
    zwbjChange(event) {
      this.setData({
        'form.zwbj': event.detail.bm
      })
    },
    // 行业返回数据
    sshyChange(event) {
      this.setData({
        'form.hy': event.detail
      })
    },
    clear() {
      this.setData({
        form: {
          hy: '',
          zwbj: '',
          qh: '',
          startDate: '',
          endDate: ''
        }
      })
      this.initData()
    },
    initData() {
      this.setData({
        loading: true
      })
      wxcdTjByParams({
        startdate: this.data.form.startDate,
        enddate: this.data.form.endDate,
        qh: this.data.form.qh,
        zwbj: this.data.form.zwbj,
        hy: this.data.form.hy,
      }).then(res => {
        let seriesData = []
        res.data.forEach(item => {
          seriesData.push({
            name: item.mch,
            value: Number(item.num),
            bm: item.bm
          })
        })
        option.series[0].data = seriesData;
        // 给chart图表添加接口返回的数据
        setTimeout(() => {
          chart.setOption(option);
          this.setData({
            loading: false
          })
          let that = this;
          let timer = null;
          chart.on('click', function (params) {
            if (timer) return;
            timer = setTimeout(function () {
              wx.navigateTo({
                url: '/pages/statistics/components/detail/index?yh=' + params.data.bm + '&name=' + params.data.name + '&params=' + JSON.stringify(that.data.form),
                success: function () {
                  timer = null;
                }
              })
            }, 500)
          });
        }, 1000);
      })
    },
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  ready() {
    this.initData()
  },
})